<template>
  <div>
    <div>
      <TopFilter :list="topFilterList" :cols="4" labelWidth="120" @filterChange="changeHandle"
        @onCollapse="collapseHandle"></TopFilter>
      <FilterTable ref="table" :columns="columns" :fetchapi="fetchApi" :params="fetchParams" :datakey="'records'"
        :isSelectColumn="false" :onColumnsChange="columns => this.columns = columns">
        <!-- <template slot="controls" >
            <el-button size="small" type="primary"       @click="showAddNew = true">新增</el-button>
        </template> -->
        <template slot="controls">
          <el-button size="small" type="primary" icon="el-icon-upload" @click="openimportDialog()">导入</el-button>
        </template>

        <template slot="controls" >
        <multiuse-button size="small" type="primary" :click="claimExportData">导出</multiuse-button>
<!--        <el-button size="small" type="primary" icon="el-icon-plus" @click="dialogHandle('','add')">新增</el-button>-->
      </template>

      </FilterTable>



      <BaseDialog style="min-height: 80vh;" :visible.sync="visibleImport" width="80vw" title="模板导入" destroyOnClose
        :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '50px' }">
        <ExcelImport ref="import" template-file-name="员工信息模板.xlsx" :importRules="importRules"
          :onComplete="importComplete" @close="visibleImport = false" />
      </BaseDialog>


    </div>

    <Drawer :visible.sync="isShow" :title="''" width="80%" destroyOnClose
      :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <showModal :rowData="rowData" @close="close" />
    </Drawer>

  </div>
</template>

<script>
import { mapState } from 'vuex';
import { dictionary } from '@/utils/dictMixin';
import { editPassword } from '@/api/common/auth/employeeAuth';
import { getStationfStaffByPage } from '@/api/cms-api/origin/personnelInfo/stationStaff/index.js';
import { systemCode } from '@/utils/validate'
import showModal from './showModal'
import ExcelImport from '@/components/ExcelImport';
import { importConfirmSalesZone } from '@/api/common/auth/dealerStaff/index.js';
import { IDNumber, zipCode, phone, email, testPW } from '@/utils/validate';
import { getDealerCompanyByPage,getClaimListForExport1 } from '@/api/common/company/index.js';
import { exportExcelFile } from '@/utils/index';
export default {
  name: 'DealerStaff',
  mixins: [dictionary],
  components: {
    showModal,
    ExcelImport
  },
  data() {
    this.BaseTable = null;
    return {
      topFilterList: this.createTopFilterList(),
      fetchApi: getStationfStaffByPage,
      fetchParams: {},
      columns: this.createTableColumns(),
      isShow: false,
      rowData: "",

      visibleImport: false,

      importRules: [
        // { prop: 'companyCode', title: '公司代码' },
         { prop: 'companyCode', title: '公司代码' , rule: [{ required: true, message: '公司代码不能为空' },]},
         {prop: 'companyName',title:'公司名称',rule: [{ required: true, message: '公司名称不能为空' },]},
        { prop: 'employeeName', title: '姓名', rule: { required: true, message: '姓名不能为空' } },
        {
          prop: 'certificationNo', title: '身份证号', rule: [{ required: true, message: '身份证号不能为空' }, {
            validator: (callback, rule, val, row, datas) => {
              if (val === undefined || val === '' || val === null) {
                callback();
              }
              const city = {
                11: '北京',
                12: '天津',
                13: '河北',
                14: '山西',
                15: '内蒙古',
                21: '辽宁',
                22: '吉林',
                23: '黑龙江 ',
                31: '上海',
                32: '江苏',
                33: '浙江',
                34: '安徽',
                35: '福建',
                36: '江西',
                37: '山东',
                41: '河南',
                42: '湖北 ',
                43: '湖南',
                44: '广东',
                45: '广西',
                46: '海南',
                50: '重庆',
                51: '四川',
                52: '贵州',
                53: '云南',
                54: '西藏 ',
                61: '陕西',
                62: '甘肃',
                63: '青海',
                64: '宁夏',
                65: '新疆',
                71: '台湾',
                81: '香港',
                82: '澳门',
                91: '国外 '
              };

              // const tip = ''
              if (!val || !/^\d{15}$/ || !/^\d{6}(18|19|20)\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i.test(val)) {
                callback(new Error('请输入正确的身份证号码'));
              } else if (!city[val.substr(0, 2)]) {
                callback(new Error('请输入正确的身份证号码'));
              } else {
                // 18位身份证需要验证最后一位校验位
                if (val.length === 18) {
                  val = val.split('');
                  // ∑(ai×Wi)(mod 11)
                  // 加权因子
                  var factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
                  // 校验位
                  var parity = [1, 0, 'X', 9, 8, 7, 6, 5, 4, 3, 2];
                  var sum = 0;
                  var ai = 0;
                  var wi = 0;
                  for (var i = 0; i < 17; i++) {
                    ai = val[i];
                    wi = factor[i];
                    sum += ai * wi;
                  }
                  // var last = parity[sum % 11]
                  if (String(parity[sum % 11]) !== val[17]) {
                    callback(new Error('请输入正确的身份证号码'));
                  } else {
                    callback();
                  }
                } else {
                  callback();
                }
              }
            }
          }]
        },

        // { prop: 'isCertifcate2', title: '是否认证', rule: [{ required: true, message: '认证不能为空' },] },
        //  { prop: 'isCertifcate3', title: '是否认证2' },
          { prop: 'stationName', title: '主关键岗位', rule: { required: true, message: '主关键岗位不能为空' } },
          {prop: 'serialNumber',title: '主岗位认证编号',rule: [{ required: true, message: '主认证编号不能为空' },]},
          { prop: 'certifacateTime1', title: '主岗位认证时间' ,rule : [{required: true, message: '认证时间不能为空'}]},
          { prop: 'stationNameone', title: '次岗位' },
          { prop: 'certifacateTime3', title: '次岗位认证时间' },
          {prop: 'serialNumber2',title: '次岗位认证编号'},
          {prop: 'projectName',title: '认证项目',rule: [{ required: true, message: '认证项目不能为空' },]},
      ],

    };
  },
  methods: {



    createTableColumns() {
      return [
        // {
        //   title: '操作',
        //   dataIndex: 'column-action',
        //   width: 130,
        //   fixed: 'left',
        //   render: props => {
        //     return (
        //       <div>
        //         <el-button size="mini" type="text"  onClick={ ()=>this.showHandle(props.row) }>
        //           查看
        //         </el-button>
        //       </div>
        //     );
        //   }
        // },
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
          {
          title: '公司代码',
          dataIndex: 'companyCode',
          sorter: true,
          filter: true,
          filterType: 'input',
          render: props => {
            return <span>{props.row.companyCode === 'BJ' ? '' : props.row.companyCode}</span>;
          }
        },

            {
          title: '公司名称',
          dataIndex: 'companyName',
          sorter: true,
          filter: true,
          filterType: 'input',
        },

           {
          title: '员工编号',
          dataIndex: 'employeeNo',
          sorter: true,
          filter: true,
          filterType: 'input',
        },
       {
          title: '联系方式',
          dataIndex: 'employeePhone',
          sorter: true,
          filter: true,
          filterType: 'input',
        },
        {
          title: '在职状态',
          dataIndex: 'employeeStatus',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList('1008'),
          render: props => {
            return <span>{this.createDictText(props.row.employeeStatus, '1008')}</span>;
          }
          // align:"center"

        },

         {
          title: '员工姓名',
          dataIndex: 'employeeName',
          sorter: true,
          filter: true,
          filterType: 'input',
        },

         {
          title: '身份证号',
          dataIndex: 'certificationNo',
          sorter: true,
          filter: true,
          width: 200,
          filterType: 'input',

        },

        {
          title: '主关键岗位',
          dataIndex: 'stationName1',
          sorter: true,
          filter: true,
          filterType: 'input',
        },

         {
          title: '主岗位是否认证',
          dataIndex: 'isCertifacate1',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList('1004'),
          render: props => {
            return <span>{this.createDictText(props.row.isCertifacate1, '1004')}</span>;
          }
        },

         {
          title: '主岗位认证编号',
          dataIndex: 'serialNumber1',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterType: 'input',

        },

          {
          title: '主岗位认证时间',
          dataIndex: 'certifacateTime1',
          sorter: true,
          filter: true,
          filterType: 'input',
          dateFormat: 'yyyy-MM-dd '
        },


        {
          title: '次关键岗位',
          dataIndex: 'stationName2',
          sorter: true,
          filter: true,
          filterType: 'input',
        },
        {
          title: '次岗位是否认证',
          dataIndex: 'isCertifacate2',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList('1004'),
          render: props => {
            return <span>{this.createDictText(props.row.isCertifacate2, '1004')}</span>;
          }
        },
        {
          title: '次岗位认证编号',
          dataIndex: 'serialNumber2',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterType: 'input',

        },

       {
          title: '次岗位认证时间',
          dataIndex: 'certifacateTime2',
          sorter: true,
          filter: true,
          filterType: 'input',
          dateFormat: 'yyyy-MM-dd '
        },


        {
          title: '认证项目',
          dataIndex: 'projectName',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterType: 'input',

        },


      ];
    },

    createTopFilterList() {
      return [
        {
          type: 'INPUT',
          label: '岗位名称',
          fieldName: 'stationName',
          placeholder: '岗位名称...',
          style: { width: '200px' },
        },
        {
          type: 'INPUT',
          label: '员工编号',
          fieldName: 'employeeNo',
          placeholder: '员工编号...',
          style: { width: '200px' },
        },
        {
          type: 'INPUT',
          label: '员工姓名',
          fieldName: 'employeeName',
          placeholder: '员工姓名...',
          style: { width: '200px' },
        },
        {
          type: 'INPUT',
          label: '公司代码',
          fieldName: 'companyCode',
          placeholder: '公司代码...',
          style: { width: '200px' },
        },
        {
          type: 'INPUT',
          label: '公司名称',
          fieldName: 'companyName',
          placeholder: '公司名称...',
          style: { width: '200px' },
        },
        {
          type: 'SELECT',
          label: '在职状态',
          fieldName: 'employeeStatus',
          placeholder: '在职状态...',
          style: { width: '200px' },
          itemList: this.createDictList('1008'),
        },
        {
          type: 'SELECT',
          label: '是否认证',
          fieldName: 'isCertifacate',
          placeholder: '是否认证...',
          style: { width: '200px' },
          itemList: this.createDictList('1004'),
        },
        { type: 'RANGE_DATE', label: '认证时间', fieldName: 'certifacateTime', placeholder: '请选择', initialValue: '' },

      ];
    },

 // 员工信息维护导出
      async claimExportData() {
        await getClaimListForExport1(this.fetchParams).then(res => {
          console.log(res);

          exportExcelFile(res.data, '员工信息维护导出');
        });
      },


    drawerClose(type) {

      this.visibleImport = false;
      if (type === 'refresh') {
        // 重新加载
        this.fetchParams = { ...this.fetchParams };
      }
    },

    openimportDialog() {
      this.visibleImport = true;
    },

    async importComplete(datas, callback) {
      importConfirmSalesZone(datas).then(res => {
        if (res) {
          debugger;
          if (res.success) {
            this.visibleImport = false;
            this.$notify.success({ title: '提示信息', message: '批量导入成功' });
            callback();
            this.drawerClose('refresh');
          } else {
            callback(res.data);
          }
        } else {
          callback([{ errormsg: '服务器运行异常' }]);
        }
      });
    },

    init() {
    },
    getCookie() {
      let allCookie = document.cookie.split(';')
      allCookie.forEach(x => {
        if (x.indexOf('dataType') > -1) {
          this.dataType = x.split('=')[1]
        }
      })
    },
    // 重置密码
    resetPassword(row) {
      this.title = '重置密码';
      this.open(row);
    },
    //确定重置密码
    open(row) {
      // console.log(row,"resetPassword")

      this.$confirm('确定重置密码吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          //请求接口
          editPassword(row.employeeNo).then(res => {
            if (res.resultCode == 200) {
              this.$message({
                type: 'success',
                message: '密码重置成功!'
              });
              this.closeDialog(false, 'refresh');
            }
          });
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消密码重置'
          });
          this.closeDialog(false);
        });
    },
    closeDialog(val, type, roleNo, employeeName) {
      console.log(roleNo, employeeName, 'roleNo456', type);
      this.showAddNew = val;
      if (type === 'refresh') {
        // 重新加载
        this.fetchParams = { ...this.fetchParams };
      }
      if (type == 'deploy') {
        this.isShow = val;
        this.employeeNo = roleNo;
        this.employeeName = employeeName;
        this.promptlType = 'deploy';
      }
    },
    changeHandle(val) {
      this.fetchParams = Object.assign({}, val);
      this.fetchParams.certifacateTime1 = val.certifacateTime[0];
      this.fetchParams.certifacateTime2 = val.certifacateTime[1];
      if (val.certifacateTime[0]) {
        this.fetchParams.certifacateTime1 = val.certifacateTime[0];
      } else {
        this.fetchParams.certifacateTime1 = null;

      }
      if (val.certifacateTime[1]) {
        this.fetchParams.certifacateTime2 = val.certifacateTime[1];
      } else {
        this.fetchParams.certifacateTime2 = null;

      }

    },
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    // 查看
    showHandle(row) {
      console.log(row, "row")
      this.isShow = true
      this.rowData = row
    },
    close() {
      this.isShow = false
    },
    closeHandler(val, type) {
      this.visible = val;
      if (type === 'refresh') {
        // 重新加载
        this.fetchParams = { ...this.fetchParams };
      }
    }
  },
  mounted() {
    this.BaseTable = this.$refs.table.$refs.pageTable;
    this.init()
    this.getCookie()
  }
};
</script>

<style lang="less" scoped>
</style>
